console.log('Script loaded'); // 确认脚本已加载

const canvas = document.getElementById('gameCanvas');
console.log(canvas); // 确认获取到 canvas 元素
const ctx = canvas.getContext('2d');
console.log(ctx); // 确认获取到 canvas 上下文

const canvasWidth = 800;
const canvasHeight = 600;
canvas.width = canvasWidth;
canvas.height = canvasHeight;

const duck = {
    x: canvasWidth / 2 - 25,
    y: 10,
    width: 50,
    height: 50,
    color: 'yellow',
    speed: 2,
    direction: 1
};

const player = {
    x: canvasWidth / 2 - 25,
    y: canvasHeight - 60,
    width: 50,
    height: 50,
    color: 'blue',
    speed: 5
};

let shuttlecock = {
    x: canvasWidth / 2 - 10,
    y: player.y - 20,
    width: 20,
    height: 20,
    color: 'red',
    speedX: 0,
    speedY: 0,
    active: false
};

function drawRect(x, y, width, height, color) {
    ctx.fillStyle = color;
    ctx.fillRect(x, y, width, height);
}

function update() {
    // 更新小鸭子位置
    duck.x += duck.speed * duck.direction;
    if (duck.x <= 0 || duck.x + duck.width >= canvasWidth) {
        duck.direction *= -1;
    }

    // 更新羽毛球位置
    if (shuttlecock.active) {
        shuttlecock.x += shuttlecock.speedX;
        shuttlecock.y += shuttlecock.speedY;

        // 碰撞检测
        if (shuttlecock.x <= 0 || shuttlecock.x + shuttlecock.width >= canvasWidth) {
            shuttlecock.active = false; // 羽毛球消失
        }
        if (shuttlecock.y <= 0 || shuttlecock.y + shuttlecock.height >= canvasHeight) {
            shuttlecock.active = false; // 羽毛球消失
        }

        // 检测羽毛球与小鸭子的碰撞
        if (shuttlecock.x < duck.x + duck.width &&
            shuttlecock.x + shuttlecock.width > duck.x &&
            shuttlecock.y < duck.y + duck.height &&
            shuttlecock.y + shuttlecock.height > duck.y) {
            shuttlecock.speedY *= -1; // 反弹
        }

        // 检测羽毛球与玩家的碰撞
        if (shuttlecock.x < player.x + player.width &&
            shuttlecock.x + shuttlecock.width > player.x &&
            shuttlecock.y < player.y + player.height &&
            shuttlecock.y + shuttlecock.height > player.y) {
            shuttlecock.speedY *= -1; // 反弹
        }
    }
}

function draw() {
    ctx.clearRect(0, 0, canvasWidth, canvasHeight);
    drawRect(duck.x, duck.y, duck.width, duck.height, duck.color);
    drawRect(player.x, player.y, player.width, player.height, player.color);
    if (shuttlecock.active) {
        drawRect(shuttlecock.x, shuttlecock.y, shuttlecock.width, shuttlecock.height, shuttlecock.color);
    }
}

function gameLoop() {
    update();
    draw();
    requestAnimationFrame(gameLoop);
}

document.addEventListener('keydown', event => {
    switch (event.key) {
        case 'ArrowLeft':
            player.x = Math.max(0, player.x - player.speed);
            break;
        case 'ArrowRight':
            player.x = Math.min(canvasWidth - player.width, player.x + player.speed);
            break;
    }
});

canvas.addEventListener('click', (event) => {
    if (!shuttlecock.active) {
        const rect = canvas.getBoundingClientRect();
        const mouseX = event.clientX - rect.left;
        const mouseY = event.clientY - rect.top;

        const dx = mouseX - (player.x + player.width / 2);
        const dy = mouseY - (player.y + player.height / 2);
        const distance = Math.sqrt(dx * dx + dy * dy);

        shuttlecock = {
            x: player.x + player.width / 2 - 10,
            y: player.y - 20,
            width: 20,
            height: 20,
            color: 'red',
            speedX: (dx / distance) * 5,
            speedY: (dy / distance) * 5,
            active: true
        };
    }
});

gameLoop();
